<template>
	<view class="home">
		<view class="header">
			<u-navbar placeholder :showLeftIcon="false" titleStyle="color:#fff;" title="维普互联网医院"
				bgColor="transparent"></u-navbar>
			<view class="outer">
				<!-- 搜索 -->
				<view class="search">
					<u-search :showAction="false" placeholder="请输入疾病症状及医生姓名进行搜索..." placeholderColor="#bcbcbc"
						bgColor="#dff5fd" disabled @click="Onsearch">
					</u-search>
				</view>
			</view>
		</view>
		<view class="home_nav flex-row-between">
			<navigator hover-class="none" class="nav_item flex-column-center" url="/pagesL/quick/index">
				<image src="/static/home/nav1.png" mode="aspectFill"></image>
				<view class="font15 font-b">极速问诊</view>
				<view class="font11 font-A7A7A7" style="margin-top: 4rpx;">60秒火速接诊</view>
			</navigator>
			<navigator hover-class="none" class="nav_item flex-column-center" url="/pages/home/finddoctor">
				<image src="/static/home/nav2.png" mode="aspectFill"></image>
				<view class="font15 font-b">专家问诊</view>
				<view class="font11 font-A7A7A7" style="margin-top: 4rpx;">60秒火速接诊</view>
			</navigator>
			<navigator hover-class="none" class="nav_item flex-column-center" url="/pagesL/quick/diagReport2">
				<image src="/static/home/nav3.png" mode="aspectFill"></image>
				<view class="font15 font-b">报告解读</view>
				<view class="font11 font-A7A7A7" style="margin-top: 4rpx;">60秒火速接诊</view>
			</navigator>
		</view>
		<view class="home_head flex-row-between">
			<view class="h100 flex-column-between" style="width: 340rpx;">
				<navigator class="head_item flex-row-start" hover-class="none" url="/pagesL/check/index">
					<image src="/static/home/head1.png" mode="aspectFill"></image>
					<view class="inner">
						<view class="font15 font-b">预约检查</view>
						<view class="font11 font-A7A7A7" style="margin-top: 4rpx;">预约省时又省心</view>
					</view>
				</navigator>
				<navigator class="head_item flex-row-start" hover-class="none" url="/pagesA/home/educaList">
					<image src="/static/home/head2.png" mode="aspectFill"></image>
					<view class="inner">
						<view class="font15 font-b">健康百科</view>
						<view class="font11 font-A7A7A7" style="margin-top: 4rpx;">健康热榜与科普</view>
					</view>
				</navigator>
			</view>

		<view @click="handleClick" class="head_item2" hover-class="none" url="/pagesL/check/index">		
				<view class="flex-row-start">
					<image class="image1" src="/static/home/head3.png" mode="aspectFill"></image>
					<view>
						<view class="font15 font-b">健康商城</view>
						<view class="font11 font-A7A7A7" style="margin-top: 4rpx;">尊享健康有质保</view>
					</view>
				</view>
				<image class="image2" src="/static/home/head4.png" mode="aspectFill"></image>			
			</view>
		</view>
  
		<navigator @click="bdClick" hover-class="none" class="home_adv flex-row-between">
			<image src="/static/home/adv.png" mode="aspectFill"></image>
			<view>
				<view class="font-096A9B font15 font-b">眼底一张照，眼病全知道</view>
				<view class="font11 font-A7A7A7">早筛查  早诊断  早治疗</view>
			</view>
			<view class="adv_bnt">立即咨询</view>
		</navigator>

		<view class="title font-b">名医推荐</view>
		<view class="lj-doctor-list">
			<view class="item" v-for="(item,index) in list" :key="index" @click="Oninquiry(item)">
				<view class="status success" v-if="item.newwork_status==1">在线</view>
				<view class="status warn" v-else-if="item.newwork_status==2">繁忙</view>
				<view class="status" v-else>离线</view>
				<view class="info u-flex">
					<image class="avatar" :src="$base.cdn(item.img,'/static/lj/common/default-doctor.png')"
						mode="aspectFill"></image>
					<view>
						<view class="tit u-flex u-flex-items-end font-b">
							<view class="name">{{item.name}}</view>
							<view class="zc">{{item.academic_title||'暂无职称'}}</block>
							</view>
						</view>
						<view class="u-flex">
							<view class="address">{{item.city}}{{item.practice_organization||'暂无'}}</view>
							<view class="department">{{item.room_name||'暂无科室'}}</view>
						</view>
						<view class="con">
							擅长：{{item.be_good_at_synopsis||'暂无'}}
						</view>
					</view>
				</view>
				<view class="num-box u-flex u-flex-between">
					<view class="num-item u-flex">
						<view class="label">接诊：</view>
						<view class="num">{{parseInt(item.consultation_total_count)}}</view>
					</view>
					<view class="num-item u-flex">
						<view class="label">好评：</view>
						<!-- <view class="num">{{parseFloat(item.score||0)>0?(parseFloat((parseFloat(item.score||0)/5*100).toFixed(2))>100?100:0+'%':'暂无'}}</view> -->
						<view class="num">
							{{
						item.consultation_total_count === 0
						  ? '0%'
						  : ((parseFloat(item.score || 0) / 5 * 100) >= 100
							  ? '100%'
							  : ((parseFloat(item.score || 0) / 5 * 100).toFixed(2)) + '%')
					  }}
						</view>



					</view>
					<view class="num-item u-flex">
						<view class="label">回复：</view>
						<view class="num">较快</view>
					</view>
				</view>
			</view>
		</view>
		<ComTabBar :selected="0"></ComTabBar>
	</view>
</template>

<script>
	import ComTabBar from '@/components/ComTabBar.vue';
	import AnNoticeBar from '@/components/an-notice-bar/an-notice-bar.vue';
	export default {
		components: {
			ComTabBar,
			AnNoticeBar
		},
		data() {
			return {
				statusBarHeight: 0,

				pwappid: '',
				pwpage: '',
				jkscappid: '',
				jkscpage: '',

				noticeMsg: [], //公告咨询

				list: [],

				//轮播数据
				rotationList: [],
				//轮播参数
				bannerCurrent: 0,
				dotsStyles: {
					width: 3,
					height: 3,
					backgroundColor: 'rgba(51, 51, 51, .3)',
					border: '1px rgba(51, 51, 51, .3) solid',
					selectedBackgroundColor: '#6bcbb6',
					selectedBorder: '1px #6bcbb6 solid'
				},
			}
		},
		onLoad(option) {
			if (option.spuid) this.$store.commit('setSpuid', option.spuid)
			else if (Object.keys(option).length) {
				const {
					scene
				} = option
				if (scene) {
					const sceneObj = this.$base.getUrlParams(decodeURIComponent(scene))
					if (sceneObj.spuid) this.$store.commit('setSpuid', sceneObj.spuid)
				}
			}

			var that = this
			this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight
			uni.hideTabBar()

			that.$Http({
				url: 'getOthMiniConfig',
				data: {},
				token: false
			}).then(res => {
				if (res.code == 1) {
					that.pwappid = res.data.pwappid
					that.pwpage = res.data.pwpage
					that.jkscappid = res.data.jkscappid
					that.jkscpage = res.data.jkscpage
				}
			});

			this.init()
		},
		onPageScroll: function(e) {
			var a = e.scrollTop / 80
			this.navbarBgAlpha = a > 1 ? 1 : a
		},
		onShareAppMessage(res) {
			var data = {
					path: '/pages/home/index?spuid=' + this.$store.state.user.uid
				},
				shareConfig = this.$store.state.shareConfig
			console.log(shareConfig)
			if (shareConfig.title) data.title = shareConfig.title
			if (shareConfig.image) data.imageUrl = this.$base.cdn(shareConfig.image)
			return data
		},
		methods: {
			gotoMini(appid, page) {
				uni.navigateToMiniProgram({
					appId: appid,
					path: page,
					success(e) {
						console.log('gotoMini', e)
					},
					fail(e) {
						console.log('gotoMini fail', e)
					}
				})
			},
			//搜索
			Onsearch() {
				uni.navigateTo({
					url: '/pagesA/ask/sechlist'
				});
			},

			init() {
				var that = this

				//公告咨询
				let dynamic = new Promise((resolved, rejected) => {
					that.$Http({
						url: 'dynamic',
						data: {
							is_recommend: 1
						},
						token: false
					}).then(res => {
						if (res.code == 1) {
							that.noticeMsg = res.data.data;
						}
						resolved(true)
					});
				})

				//轮播
				let banner = new Promise((resolved, rejected) => {
					that.$Http({
						url: 'banner',
						data: {},
						token: false
					}).then(res => {
						if (res.code == 1) {
							that.rotationList = res.data
						}
						resolved(true)
					});
				})

				Promise.all([dynamic, banner]).then((result) => {
					that.loadif = true
				}).catch((error) => {})

				// 名医推荐
				that.getList()
			},
			getList() {
				var that = this
				this.$Http({
					url: 'doctorSearch3',
					token: false
				}).then(res => {
					if (res.code == 1) {
						that.list = res.data;
					}
				})
			},

			// 轮播图change
			swiperChange(e) {
				this.bannerCurrent = e.detail.current;
			},
			// 路由跳转: tag默认false,tag=true跳到tabBar页面
			goNext(url, tag) {
				if (tag) {
					uni.switchTab({
						url: url
					});
				} else {
					uni.navigateTo({
						url: url
					});
				}
			},

			//详情
			Onbar(e) {
				uni.navigateTo({
					url: '/pagesA/info/newsinfo?type=dynamic&id=' + e.id
				});
			},


			//医生详情页
			Oninquiry(res) {
				uni.navigateTo({
					url: '/pagesA/ask/inquiry?id=' + res.id,
				})
			},
			bdClick(){
				uni.navigateToMiniProgram({
				        appId: 'wxf0ec5004c5c4bcac',
				        path: 'pages/tabbar/index/index', // 不填默认首页
				        extraData: {
				        },
				        success(res) {
				            // 打开成功
				        }
				})
			},
			handleClick(){
				uni.navigateTo({
					url:'/pages/home/newh5?url=https://f256564451cd9080.saas.lionbox.cc'
				})
			}
		}
	}
</script>

<style lang="less">
	@import '@/pages/home/index.less';

	page {
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
	}
</style>